<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        window.onload = function() {
            /* 一、创建元素节点
                document.createElement():
                   1. 可以用于创建一个元素节点对象，它需要一个标签名作为参数，
                   将会根据该标签名创建元素节点对象，并将创建好的对象作为返回值返回 
            */

            /* 二、创建文本节点
                document.createTextNode():
                   1. 可以用来创建一个文本节点对象，它需要一个文本内容作为参数，
                   将会根据该内容创建文本节点，并将新的节点返回
            */

            /* 三、向父节点中增加子节点
                父节点.appendChild()
            */

            /* 四、可以在指定的子节点前插入新的子节点
                父节点.insertBefore(新节点，旧节点)
            */

            /* 五、用指定的子节点替换已有的子节点
                父节点.replaceChild(新节点，旧节点)
            */

            /* 六、删除子节点
                法一：父节点.removeChild(子节点)
                法二（自杀式操作）：子节点.parentNode.removeChild(子节点)
            */
        }
    </script>
</head>
<body>
    
</body>
</html>